<template>
	<view class="content">
		<image class="bg" src="/static/1.png"></image>
		<view class="text-area">
			<text class="title">库洛米和巴库在一起的第581天</text>
		</view>
		<div class="btn">
			<div class="btn1">
				<image class="bt" src="/static/kulomi/灵动素材 (15).png" ></image>
				<p>每日打卡</p>
			</div>
			<div class="btn2">
				<image class="bt" src="/static/kulomi/灵动素材 (39).png" ></image>
				<p>做任务</p>
			</div>
			<div class="btn3">
				<image class="bt" src="/static/kulomi/灵动素材 (32).png" ></image>
				<p>任务商城</p>
			</div>
			<div class="btn4">
				<image class="bt" src="/static/kulomi/灵动素材 (17).png" ></image>
				<p>积分榜</p>
			</div>
		</div>
	</view>	
</template>
<script>
	export default {
		name: 'Home',
		data() {
			return {
			   
			}
		},
		mounted() {
		
		},
		methods: {

		}
	}
</script>

<style>
p{
	font-size: 22px;
}

.bg{
	width: 414px;
	height: 232px;
}
.nav{
	width: 414px;
	height: 80px;
}
.text-area{
	margin-top: 15px;
	text-align: center;
	font-size: 25px;
	font-style: inherit;
}
.btn{
    margin-left: 20px;
	padding: 5px 10px;
	text-align: center;
}
.content{
	height: 807px;
	background-color: #f2f2f2;
}
.btn2,.btn4{
	float: left;
	margin: 15px 28px;
	width: 151px;
	height: 151px;
	background-color: #FFFFFF;
	border-radius: 30px;
}
.btn1,.btn3{
	float: left;
	margin: 15px 7px;
	width: 151px;
	height: 151px;
	background-color: #FFFFFF;
	border-radius: 30px;
}
.bt{
	width: 125px;
	height: 113px;
}
</style>

